<template>
  <div style="padding: 25px; min-height: 360px">
    <BaseForm
      labelWidth="100px"
      :inline="true"
      :fromIems="fromIems"
      ref="BaseForm"
      @submit="submit"
      @edit="edit"
      v-bind="$attrs"
      v-on="$listeners"
    ></BaseForm>
    <div class="footer_card">
      <el-button type="primary" @click="confrim" v-if="!isEdit">提交</el-button>
      <el-button
        type="primary"
        @click="confrim"
        v-if="isEdit && !$route.query.info"
        >确认修改</el-button
      >
    </div>
  </div>
</template>

<script>
import tableMixin from "@/mixins";
import { getDicCode } from "@/api/baseset";
import { searchFormParams, uploadImg } from "@/utils";
import { getAreaList, getId } from "@/api/common";
export default {
  mixins: [tableMixin],
  components: {},
  data() {
    return {
      isEdit: false,
      fromIems: [
        {
          valueType: "input",
          label: "ID",
          dataIndex: "id",
          rules: [{ required: true, message: "请输入", trigger: "blur" }],
          props: {
            disabled: true,
            style: {
              width: "220px",
            },
          },
        },
        {
          valueType: "input",
          label: "产品名称",
          dataIndex: "name",
          rules: [{ required: true, message: "请输入", trigger: "blur" }],
        },
        {
          valueType: "select",
          label: "产品类型",
          dataIndex: "cat",
          search: true,
          options: [],
          rules: [{ required: true, message: "请选择", trigger: "blur" }],
        },
        {
          valueType: "select",
          label: "产品型号",
          dataIndex: "model",
          options: [],
          search: true,
          rules: [{ required: true, message: "请选择", trigger: "blur" }],
        },
        {
          valueType: "select",
          label: "产品品牌",
          dataIndex: "brand",
          search: true,
          rules: [{ required: true, message: "请选择", trigger: "blur" }],
        },
        {
          valueType: "img",
          label: "封面图片",
          dataIndex: "coverUrl",
          rules: [{ required: true, message: "请上传", trigger: "blur" }],
          uplaod: (e) => this.handleUploadCover(e),
          defaultValue: "",
        },
        {
          valueType: "input",
          label: "产品售价",
          dataIndex: "sellPrice",
          rules: [{ required: true, message: "请输入", trigger: "blur" }],
        },
        // 以上必传

        {
          valueType: "input",
          label: "产品系列",
          dataIndex: "series",
        },
        {
          valueType: "input",
          label: "功率(W)",
          dataIndex: "power",
        },
        {
          valueType: "input",
          label: "规格大小",
          dataIndex: "specs",
          props: {
            placeholder: "(长x宽x高(cm/cm/cm)",
            style: {
              width: "220px",
            },
          },
        },
        {
          valueType: "input",
          label: "通道模式",
          dataIndex: "channelMode",
        },
        {
          valueType: "input",
          label: "光源",
          dataIndex: "lightSource",
        },
        {
          valueType: "input",
          label: "寿命",
          dataIndex: "lifeTime",
        },
        {
          valueType: "input",
          label: "额定电压",
          dataIndex: "ratedVoltage",
        },
        {
          valueType: "input",
          label: "频率(Hz)",
          dataIndex: "frequency",
        },
        {
          valueType: "input",
          label: "净重(kg)",
          dataIndex: "netWeight",
        },
        
      ],
    };
  },
  mounted() {
    this.initSelectData();
    if (this.$route.query.id) {
      this.isEdit = true;
    } else {
      this.initID();
      this.isEdit = false;
    }
    this.initAddrData()
  },

  methods: {
    // 生成id
    async initID() {
      const res = await getId({ type: "goods " });
      searchFormParams(this, "id").defaultValue = res.content.id;
    },
    // 获取下拉数据
    async initSelectData() {
      // 品牌
      const brandRes = await getDicCode({ type: 1, pageSize: 100 });
      // 型号
      const modelRes = await getDicCode({ type: 2, pageSize: 100 });
      // 分类
      const catRes = await getDicCode({ type: 3, pageSize: 100 });
      searchFormParams(this, "brand").options = brandRes.content.map((el) => {
        return {
          value: el.code,
          label: el.name,
        };
      });
      searchFormParams(this, "cat").options = catRes.content.map((el) => {
        return {
          value: el.code,
          label: el.name,
        };
      });
      searchFormParams(this, "model").options = modelRes.content.map((el) => {
        return {
          value: el.code,
          label: el.name,
        };
      });

      
    },
    // 获取地区
    async initAddrData(){
      const res = await getAreaList({level:1})
    },
    // 封面
    handleUploadCover(e) {
      uploadImg(e, 1024 * 1024, {}, "light", (res) => {
        searchFormParams(this, "coverUrl").defaultValue = res;
      });
    },
    // 编辑赋值
    set(data) {
      for (var k in data) {
        this.$set(this.$refs.BaseForm.form, k, data[k]);
        searchFormParams(this, "coverUrl").defaultValue = data.coverUrl;
      }
    },
    confrim() {
      if (this.isEdit) {
        this.$refs.BaseForm.edit();
      } else {
        this.$refs.BaseForm.submit();
      }
    },
    submit(data) {
      console.log(data, "提交");
      this.$emit("submitAdd", data);
    },
    edit(data) {
      console.log(data);
      this.$emit("submitEdit", data);
    },
  },
};
</script>

<style lang="scss" scoped>
.footer_card {
  text-align: right;
}
</style>
